<template>
<view class="tui-cards-container" v-if="display">
  <view class="service-evaluation">
    <view class="header">
      <label class="header-label">是否发送当前资讯</label>
      <view class="btn-close" @tap="handleClose">关闭</view>
    </view>
    <view class="main">
		<view style="display: flex; align-items: center; margin-bottom: 20px;">
			<!-- <image style="width: 60px; height: 60px; margin-right: 10px;" :src=""></image> -->
			<view v-if="articleInfo.images.length>0" v-for="(item,index) in articleInfo.images">
				<image v-if="index==0" style="width: 60px; height: 60px; margin-right: 10px;" :src="item"></image>
			</view>
			<view style="position: relative;"  v-if="articleInfo.video!=''">
				<view style="position: absolute; z-index: 1; top: 50%; left: 50%; transform:translate(-50%,-50%)">
					<u-icon color="#fff" size="40px" name="play-right-fill"></u-icon>
				</view>
				<image style="width: 60px; height: 60px; margin-right: 10px;" :src="articleInfo.video+'?vframe/jpg/offset/1'" ></image>
			</view>
			
			<view style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" class="custom-content-text">
				{{articleInfo.title==''?articleInfo.content:articleInfo.title}}
			</view>
		</view>
	</view>	
    <view class="footer">
      <view class="btn" @tap="sendMessage" :disabled="score===0 && !comment">发送</view>
    </view>
  </view>
</view>
</template>

<script>
import {sendRights} from "@/common/config/chat.js"
import {homeDetail} from "@/common/config/request.js"
export default {
  data() {
    return {
		num:1,
		articleInfo:{}
    };
  },
  inject: ['newsid'],
  components: {},
  
  // #ifdef APP-PLUS
  props:['display','conversation'],
  // #endif
  // #ifdef MP-WEIXIN
  props: {
    display: {
      type: Boolean,
      default: ''
    },
  	conversation: {
  	  type: Object,
  	  default: () => {}
  	}
  },
  // #endif
  
  watch: {
	  // newsid(e){
		 // return this.newsid=e
	  // },
	  // #ifdef APP-PLUS
	  conversation(e){
		  this.conversation=e
	  },
	  // #endif
	  // #ifdef MP-WEIXIN
	  display: {
	    handler: function (newVal) {
	    },
	    immediate: true,
	    deep:true
	  },
	  conversation: {
	    handler: function (newVal) {
	  	  console.log(99999999,newVal)
	      // todo 值会被改变
	      this.setData({
	        conversation: newVal
	      });
	    },
	    immediate: true,
	    deep: true
	  }
	  // #endif
	  
    
  },

  onPageShow() {
	  console.log(111111111111111,this.conversation)
	// this.$on('handlePresent', function(res){
	// 	console.log(090900,res)
	// });
  },
  mounted() {
  	console.log(this.newsid,'rhthis.newsid')
	if(this.newsid.id){
		var data={
			id:this.newsid.id
		}
		homeDetail(data).then((res)=>{
			console.log(res,'文章详情')
			if(res.data.code==1){
				this.articleInfo=res.data.data
			}
		})
	}

  },
  methods: {
    handleClose() {
      this.$emit('close', {
        detail: {
          key: '4'
        }
      });
    },
    sendMessage() {
		// sendRights(uid=0).then(res=>{
		// 	console.log('赠送权益',res)
		// })
		var img=this.articleInfo.images.length>0?this.articleInfo.images[0]:this.articleInfo.video+'?vframe/jpg/offset/1'
		var title=this.articleInfo.title==''?this.articleInfo.content:this.articleInfo.title
      this.$emit('sendCustomMessage', {
        detail: {
			payload: {
			  // data 字段作为表示，可以自定义
			  data: 'news',
			  description: '新闻',
			  extension: JSON.stringify({
			    title:title,
				img:img,
				id:this.articleInfo.id
			  })
			}
        }
      });
      this.setData({
        score: 0,
        comment: ''
      });
      this.handleClose();
    },
  }
};
</script>
<style>
@import "./index.css";
</style>
